import Vue from 'vue'
import Vuex from 'vuex'
import {getMusicDetail} from "../api/baidu-music";
import user from './modules/user'
import mutations  from "./mutations";

Vue.use(Vuex)

// 创建vuex的实例
// 项目全局数据中心，存放在这里的数据，所有组件都可以直接访问到
const store = new Vuex.Store({
    // state， 存放的是vuex的数据
    state: {
        msg: "hello vuex",
        title: "标题",
        list: [
            1, 3, 4, 5, 6
        ],
        songinfo: {},
        bitrate: {},
        currentTime: 0,
        processTime: 0,
        imgStyle: {
            'animation-play-state': 'paused'
        },
        isPlay: true
    },
    // 所有涉及到state的变化都要通过mutation去修改
    // mutation是一个纯函数，里面不能参杂异步操作，不能涉及到时间操作
    mutations,
    getters: {
        num(state) {
            return state.list.length
        },
        searchList(state) {
            return state.list.filter(item => item > 3)
        }
    },
    // action里可以封装异步操作
    actions: {
        // 通过这个action初始化songinfo
        // initSongInfo(context, payload) {
        initSongInfo({commit}, payload) {
            //     const {commit} = context;
            // const commit = context.commit
            // 请求接口
            // console.log(context)
            getMusicDetail(payload.songId).then(res => {
                // 拿到请求的结果
                // context.commit("changeSongInfo", {bitrate: res.bitrate, songinfo: res.songinfo})
                commit("changeSongInfo", {bitrate: res.bitrate, songinfo: res.songinfo})
            })
        }
    },
    modules: {
        user,
        shop:{
            state:{
                goods:[
                    {id:1,name:'你好'}
                ]
            }
        }
    }
})

export default store
